<template>
	<view class="index relative">
		<block v-if="tabBar == '/pages/tabbar/index/index'">
			<view class="">
				<search placeText="输入内容123123"></search>
				<view class="swiper_box">
					<!-- @change="change" @click="click" -->
					<u-swiper :list="list1"></u-swiper>
				</view>
				<view class="flex">
					<view class="flex1" v-for="i in 5" :key="i"></view>
				</view>
				<!-- <view :class=" i <99 ? 'item' : 'active'" v-for="i in 100" :key="i">
					2313211156166
				</view> -->
			</view>
		</block>
		<block v-if="tabBar == '/pages/tabbar/order/order'">
			<search placeText="请输入订单关键词"></search>
			<orderView></orderView>
		</block>
		<block v-if="tabBar == '/pages/tabbar/tabbar-3/tabbar-3'">
			<view class="">
				3
			</view>
		</block>
		<block v-if="tabBar == '/pages/tabbar/message/message'">
			<view class="">
				4
			</view>
		</block>
		<block v-if="tabBar == '/pages/tabbar/mine/mine'">
			<view class="">
				5
			</view>
		</block>
		<view class="tabBar">
			<CustomTabBar @openTab="openTabs"></CustomTabBar>
		</view>
	</view>
</template>

<script>
	import CustomTabBar from 'pages/CustomTabBar/CustomTabBar.vue';
	import search from '@/components/search.vue';
	import orderView from '@/components/orderview.vue';
	export default {
		data() {
			return {
				src: '', // webviewSrc
				tabBar: '/pages/tabbar/index/index',
				list1: [
					'https://cdn.uviewui.com/uview/swiper/swiper1.png',
					'https://cdn.uviewui.com/uview/swiper/swiper2.png',
					'https://cdn.uviewui.com/uview/swiper/swiper3.png',
				],
				
			};
		},
		components: {
			CustomTabBar,
			search,
			orderView
		},
		onReady() {},
		onLoad() {

		},
		methods: {
			openTabs(e) {
				// console.log('e: ', e);
				this.tabBar = e.pagePath
				uni.setNavigationBarTitle({
					title: e.text
				})
			},
			
		},
		onUnload() {}
	};
</script>

<style lang="scss" scoped>
	.index {
		overflow-x: hidden;
		padding-bottom: 180rpx;
		background-color: #7a7a7a69;

		.tabBar {
			position: fixed;
			width: 100%;
			bottom: 0;
			background-color: #fff;
		}

		.item {
			width: 100%;
			height: 40rpx;
			border: 1px solid;
			background-color: skyblue;
		}

		.active {
			background-color: red;
		}

		.swiper_box {
			margin: 15rpx;
		}

		.flex {
			flex-wrap: wrap;
			justify-content: flex-start;

			.flex1 {
				margin: 20rpx;
				width: 200rpx;
				height: 200rpx;
				background-color: #7a7a7a;
			}

		}

	}
</style>